<template>
  <div>
    <button @click="changeName">切换组件</button>
    <component :is="name"></component>
  </div>
</template>

<script>
import One from '@/components/One'
import Two from '@/components/Two'
export default {
  name:"App",
  data(){
    return{
      name:"One"
    }
  },
  components:{
    One,
    Two
  },
  methods:{
    changeName(){
      this.name=this.name==="One"?"Two":"One"
    }
  }
}
</script>

<style>

</style>